{% extends "admin/pub/base.html" %}

{% block title %}
<title>商品分类列表</title>
{% endblock %}



{% block content-body %}
<div class="widget am-cf">
  <div class="widget-head am-cf">
    <div class="widget-title  am-cf"> 商品分类列表</div></div>
  <div class="widget-body  am-fr">
    <div class="am-u-sm-12 am-u-md-6 am-u-lg-6">
      <div class="am-form-group">
        <div class="am-btn-toolbar">
          <div class="am-btn-group am-btn-group-xs">
            <button type="button" class="am-btn am-btn-default am-btn-success">
              <span class="am-icon-plus"></span>新增</button>
            <button type="button" class="am-btn am-btn-default am-btn-secondary">
              <span class="am-icon-save"></span>保存</button>
            <button type="button" class="am-btn am-btn-default am-btn-warning">
              <span class="am-icon-archive"></span>审核</button>
            <button type="button" class="am-btn am-btn-default am-btn-danger">
              <span class="am-icon-trash-o"></span>删除</button>
          </div>
        </div>
      </div>
    </div>

    <form>
      <div class="am-u-sm-12 am-u-md-6 am-u-lg-3">
        <div class="am-form-group tpl-table-list-select">
          搜索类名:
        </div>
      </div>
      <div class="am-u-sm-12 am-u-md-12 am-u-lg-3">
        <div class="am-input-group am-input-group-sm tpl-form-border-form cl-p">
          <input type="text" class="am-form-field " name="keywords" value="{{ request.GET.keywords }}">
          <span class="am-input-group-btn">
            <button class="am-btn  am-btn-default am-btn-success tpl-table-list-field am-icon-search"></button>
          </span>
        </div>
      </div>
    </form>

    <div class="am-u-sm-12">
      <table width="100%" class="am-table am-table-compact am-table-striped tpl-table-black ">
        <thead>
          <tr>
            <th>id</th>
            <th>分类名称</th>
            <th>所属分类</th>
            <th>PATH路径</th>
            <th>操作</th>
            </tr>
        </thead>
        <tbody>
        {% for i in db %}
          <tr class="gradeX">
            <td class="am-text-middle tid">{{ i.id }}</td>
            <td class="am-text-middle">{{ i.name }}</td>
            <td class="am-text-middle">{{ i.pname }}</td>
            <td class="am-text-middle">{{ i.path }}</td>
            <td class="am-text-middle">
              <div class="tpl-table-black-operation">
                <a href="{% url 'type_edit' i.id %}">
                  <i class="am-icon-pencil"></i>编辑</a>
                <a href="" class="tpl-table-black-operation-del">
                  <i class="am-icon-trash"></i>删除</a>
              </div>
            </td>
          </tr>
        {% endfor %}


          <!-- more data --></tbody>
      </table>
    </div>
    <div class="am-u-lg-12 am-cf">
      <div class="am-fr">
        <ul class="am-pagination tpl-pagination">
          {% load page %}
          {% showpage num request %}
        </ul>
      </div>
    </div>
  </div>
</div>

<script>
    $('.tpl-table-black-operation-del').click(function(){
        a = $(this)
        // 获取用户的id值
        tid = $(this).parents('.gradeX').find('.tid').text()
        // 发送ajax,执行逻辑删除
        $.get('{% url "type_del" %}',{id:tid},function(data){

            if(data['status'] == 0){
                // 移除当前数据
                a.parents('tr').remove()
            }
            alert(data['msg'])
        },'json')
        // 阻止默认行为
        return false;
    })


  //$('.tpl-table-black-operation-del').click(function(){
      //var a = $(this)
      // 获取当前的对应的id值 通过父类选择器
      //var tid = $(this).parents('.gradeX').find('.tid').text()
      // 然后把id通过ajax发送到后台
      //$.get('{% url "type_del" %}',{id:tid},function(data){
        //if (data['status'] == 0){
          //a.parents('tr').remove()
       // }
        //alert(data['msg'])
      //},'json')
      // a 标签阻止默认行为 或者在href javascript:void(0)
      //return false;
  //})

</script>

{% endblock %}